/*
import React from 'react';
import ReactDom from 'react-dom';
*/


import React from 'react';
import ReactDom from 'react-dom';


//以下代码均基于自己封装的react实现：

/*let element = (
    <h1 id="title" className="title">
        <span style={{color:'white',background:'black'}}>hello</span>
        <span>world</span>
    </h1>
)*/

//dom标签
/*
let element = React.createElement("h1", {id: "title"},
    React.createElement("span", {style: {color: 'green', backgroundColor: 'blue'}}, "hello"),
    React.createElement("span", {className: 'world'}, "world"));
*/


//函数
/*
function Welcome1(props) {
    return (
        <h1 id={props.id}>
            <span>ygg</span>
            <span>world</span>
        </h1>
    )
}

let element = React.createElement(Welcome1, {id: 'title'});
*/

//函数组件返回一个函数组件：
function Welcome(props) {
    return {
        Welcomechild() {
            return (
                <h1 id="title">
                    <span>ygg</span>
                    <span>world</span>
                </h1>
            )
        }

    }

}

let element = React.createElement(Welcome);


//类
/*class Welcome extends React.Component {
    constructor(props) {
        super(props)
    }

    render() {
        return (
            <h1 id={this.props.id}>
                <span>ygg</span>
                <span>world</span>
            </h1>

        )

    }
}*/

// let element = React.createElement(Welcome, {id: 'title'});


console.log(element);


ReactDom.render(element, document.getElementById('root'));
